<include file="Public:head" />
<style>
    tr td{
        text-align: center;
    }
    .dannum{
        width: 300px;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        display: inline-block;
    }
</style>
<body class="overflow-hidden">
<div class="wrapper preload">
    <include file="Public:header" />
    <include file="Public:left" />

    <div class="main-container">
        <div class="padding-md">
            <div class="row">
                <div class="col-sm-12">
                    <div class="page-title">
                        备份数据库
                    </div>
                </div>
            </div>
            <div class="col-sm-12 row chach">
                <a id="export" class="action-button" href="javascript:;" autocomplete="off">立即备份</a>
                <a id="optimize" class="action-button" href="{:U('optimize')}">优化表</a>
                <a id="repair" class="action-button" href="{:U('repair')}">修复表</a>
                <!--<button class="action-button" type="button"id="export" >立即备份</button>-->
            </div>
            <div class="row">
                <div class="col-lg-12">
                    <div class="smart-widget widget-green">
                        <div class="smart-widget-header row ">
                            <span class="smart-widget-option">
                                <span class="refresh-icon-animated">
                                    <i class="fa fa-spinner fa-spin" style="color:#fff"></i>
                                </span>
                                <a href="#" class="widget-toggle-hidden-option">
                                </a>
                                <a href="#" class="widget-collapse-option" data-toggle="collapse">
                                </a>
                                <a href="#" class="widget-refresh-option">
                                </a>
                            </span>
                        </div>
                        <div class="smart-widget-inner table-responsive">
                            <div class="smart-widget-hidden-section">
                                <ul class="widget-color-list clearfix">
                                    <li style="background-color:#20232b;" data-color="widget-dark"></li>
                                    <li style="background-color:#4c5f70;" data-color="widget-dark-blue"></li>
                                    <li style="background-color:#23b7e5;" data-color="widget-blue"></li>
                                    <li style="background-color:#1fb5ac;" data-color="widget-green"></li>
                                    <li style="background-color:#edbc6c;" data-color="widget-yellow"></li>
                                    <li style="background-color:#fbc852;" data-color="widget-orange"></li>
                                    <li style="background-color:#e36159;" data-color="widget-red"></li>
                                    <li style="background-color:#7266ba;" data-color="widget-purple"></li>
                                    <li style="background-color:#f5f5f5;" data-color="widget-light-grey"></li>
                                    <li style="background-color:#fff;" data-color="reset"></li>
                                </ul>
                            </div>
                            <form id="export-form" method="post" action="{:U('export')}">
                            <table class="table table-striped no-margin">
                                <thead>
                                <tr>
                                    <th class="text-center" style="width: 80px"><input class="check-all" checked="chedked" type="checkbox" value=""></th>
                                    <th class="text-center" style="width: 80px">序号</th>
                                    <th class="text-center " >表名</th>
                                    <th class="text-center" style="width: 200px">数据量</th>
                                    <th class="text-center" style="width: 300px">数据大小</th>
                                    <th class="text-center" style="width: 200px">创建时间</th>
                                    <th class="text-center" style="width: 200px">备份状态</th>
                                    <th class="text-center" style="width: 200px">操作</th>

                                </tr>
                                </thead>
                                <tbody>
                                <notempty name="list">
                                    <volist name="list" id="table" key="k">
                                        <tr>
                                            <td>
                                                <input class="ids" checked="chedked" type="checkbox" name="tables[]" value="{$table.name}">
                                            </td>
                                            <td style="text-align: center;">{$k}</td>
                                            <td>{$table.name}</td>
                                            <td>{$table.rows}</td>
                                            <td>{$table.data_length|format_bytes}</td>
                                            <td title="{$table['create_time']}">{$table.create_time|substr=0,-8}</td>
                                            <td class="info">未备份</td>
                                            <td class="action">
                                                <a  href="{:U('optimize?tables='.$table['name'])}" class="ajax-get confirm">优化表</a>
                                                <a  href="{:U('repair?tables='.$table['name'])}" class="ajax-get confirm">修复表</a>
                                            </td>
                                        </tr>
                                    </volist>
                                    <else/>
                                    <td colspan="10" class="text-center"> aOh! 暂时还没有内容! </td>
                                </notempty>
                                </tbody>
                            </table>
                            </form>
                            <div class="choose-page row">
                                {$_page}
                            </div>
                        </div><!-- ./smart-widget-inner -->
                    </div><!-- ./smart-widget -->
                </div><!-- ./col -->
            </div><!-- ./row -->
        </div><!-- ./padding-md -->
    </div><!-- /main-container -->
    <include file="Public:foot" />
</div><!-- /wrapper -->
<a href="#" class="scroll-to-top hidden-print"><i class="fa fa-chevron-up fa-lg"></i></a>
</body>
</html>
<block name="script">
    <script>
        $('#optimize').on('click',function(){
            $('#optimize').text('优化完成');
        });
        $('#repair').on('click',function(){
            $('#repair').text('修复完成');
        });
        (function($){
            var $form = $("#export-form"), $export = $("#export"), tables
            $optimize = $("#optimize"), $repair = $("#repair");

            $optimize.add($repair).click(function(){
                $.post(this.href, $form.serialize(), function(data){
                    if(data.status){
                        updateAlert(data.info,'alert-success');
                    } else {
                        updateAlert(data.info,'alert-error');
                    }
                    setTimeout(function(){
                        $('#top-alert').find('button').click();
                        $(this).removeClass('disabled').prop('disabled',false);
                    },1500);
                }, "json");
                return false;
            });

            $export.click(function(){
                $export.parent().children().addClass("disabled");
                $export.html("正在发送备份请求...");
                $.post(
                        $form.attr("action"),
                        $form.serialize(),
                        function(data){
                            if(data.status){
                                tables = data.tables;
                                $export.html(data.info + "开始备份，请不要关闭本页面！");
                                backup(data.tab);
                                window.onbeforeunload = function(){ return "正在备份数据库，请不要关闭！" }
                            } else {
                                updateAlert(data.info,'alert-error');
                                $export.parent().children().removeClass("disabled");
                                $export.html("立即备份");
                                setTimeout(function(){
                                    $('#top-alert').find('button').click();
                                    $(this).removeClass('disabled').prop('disabled',false);
                                },1500);
                            }
                        },
                        "json"
                );
                return false;
            });

            function backup(tab, status){
                status && showmsg(tab.id, "开始备份...(0%)");
                $.get($form.attr("action"), tab, function(data){
                    if(data.status){
                        showmsg(tab.id, data.info);

                        if(!$.isPlainObject(data.tab)){
                            $export.parent().children().removeClass("disabled");
                            $export.html("备份完成，点击重新备份");
                            window.onbeforeunload = function(){ return null }
                            return;
                        }
                        backup(data.tab, tab.id != data.tab.id);
                    } else {
                        updateAlert(data.info,'alert-error');
                        $export.parent().children().removeClass("disabled");
                        $export.html("立即备份");
                        setTimeout(function(){
                            $('#top-alert').find('button').click();
                            $(this).removeClass('disabled').prop('disabled',false);
                        },1500);
                    }
                }, "json");

            }

            function showmsg(id, msg){
                $form.find("input[value=" + tables[id] + "]").closest("tr").find(".info").html(msg);
            }
        })(jQuery);
        $(function(){
            highlight_nav2('__SELF__');
        })


    </script>
</block>
